<script src="{{ asset('js/jquery-1.8.3.min.js') }}" type="text/javascript"></script>
<link href="{{ asset('css/bootstrap.min.css') }}" rel="stylesheet">
<link href="{{ asset('css/font-awesome.min.css') }}" rel="stylesheet" />
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<meta name="_token" content="{{csrf_token()}}">
<link rel="stylesheet" href="{{URL::asset('./css/reset.css')}}">
<link rel="stylesheet" href="{{URL::asset('./css/order/pay_order.css')}}">

<!-- home.activity.actPay -->
<div class="main" id="actpay">
    <div class="payheader">
        <a href="{{route('home.index.index') }}">
            <img :src="headerLogo" alt="">
        </a>
        <div class='rightStep'>
            <div class="completed-step "><a>确认信息</a></div>
            <div class="completed-step active"><a>支付金额</a></div>
            <div class="completed-step"><a>购买完成</a></div>
        </div>
    </div>
    <div class="hider">
        <a>
            【重要提醒】
        </a>
        ： 本网站及供应商不会以订单异常、系统升级等为由，通过电话、短信等方式要求您点击任何链接进行退款操作。
    </div>
    <div class="orderMes">
        <img src="{{URL::asset('./img/icon/paying.png')}}" alt="">
        <span>
            订单已提交，请于24小时内完成支付
            <a>
                （逾期订单将被关闭）
            </a>
        </span>
    </div>

    <div class="paymes">
        <span>支付信息</span>
        <div>
            <div :class="{active:checkNum==1}" @click="checkNum=1">
                <img src="{{URL::asset('./img/icon/checktrue.png')}}" alt="" v-if="checkNum==1">
                <img src="{{URL::asset('./img/icon/checkfalse.png')}}" alt="" v-else>
                <img src="{{URL::asset('./img/icon/zhifubao.png')}}" alt="">
            </div>
            <div :class="{active:checkNum==2}"  @click="checkNum=2">
                <img src="{{URL::asset('./img/icon/checktrue.png')}}" alt="" v-if="checkNum==2">
                <img src="{{URL::asset('./img/icon/checkfalse.png')}}" alt="" v-else>
                <img src="{{URL::asset('./img/icon/weixin.png')}}" alt="">
            </div>
        </div>
    </div>
    <p class="payMony">
        商品金额<span>
            ￥6500.00
        </span>
    </p>
    <p class="payMony">

        邮费
        <span>
            ￥0.00
        </span>
    </p>

    <div class="submitOrder">
        订单支付<span>
            ￥6500.00
        </span>
        <button @click=" window.location.href = '{{ route('home.order.completeOrder') }}'">
            提交订单
        </button>
    </div>

</div>
<script src="{{ asset('js/vue.min.js') }}" type="text/javascript"></script>
<script src="{{ asset('js/element.js') }}" type="text/javascript"></script>
<script src="{{ asset('js/moment.min.js') }}" type="text/javascript"></script>
<script src="{{ asset('js/bootstrap.min.js') }}" type="text/javascript"></script>
<script src="{{ asset('js/public.js') }}" type="text/javascript"></script>
<script>
    $(() => {
        let app = new Vue({
            el: '#actpay',
            data: () => {
                return {
                    headerLogo: '',
                    checkNum: 1,
                }
            },
            created() {
                this.headerLogo = JSON.parse(sessionStorage.getItem("overall")).site_logo

            },
            mounted() {},
            methods: {}
        })
    })
</script>